<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <title>稽查</title>
    <link rel="import" href="/view/common/commoncsslink.html?__inline">
    <link rel="stylesheet" type="text/css" href="/css/main.css">
    <link rel="stylesheet" type="text/css" href="/node_modules/zui/dist/lib/calendar/zui.calendar.css">  
    <link rel="import" href="/view/common/commonscriptlink.html?__inline">
</head>

<body>
    <link rel="import" href="/view/common/head.html?__inline">

        <!-- s-->
        <div id="main" class="container-fluid main">
            <div class="row">
                <div class="col-md-2" style="background: #328dc7;padding-right:0;z-index: 11;">
                    <div id="mum_left" class="mum_left">
                        <link rel="import" href="/view/mum.html?__inline">
                    </div>
                </div>
                <div class="col-md-10">
                    <div id="mum_right" class="mum_right">

                        <div class="panel">
                            <div class="panel-heading">
                                <ol class="breadcrumb" style="margin-bottom: 0;">
                                    <li class="active">稽查人员排班</li>
                                </ol>
                            </div>
                            <div class="panel-body" id="main_content">
                                <!--  start -->
                                <div class="container-fluid ">
                                        <div class="row">
                                            <div class="col-sm-12">
                                               <div id="calendar" class="calendar"></div>
                                            </div>
                                        </div>
                                </div>
                                <!--   end -->          
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!--对话框 开始-->
            <div class="modal fade" id="myModal">
                    <div class="modal-dialog">
                        <div class="modal-content">
                            
                        </div>
                        <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">关闭</span></button>
                        <h4 class="modal-title">添加排班-2017-03-05</h4>
                    </div>
                    <div class="modal-body">
                            <!-- 添加对话框 -->
                            <div class="container-fluid ">
                                <form class="form-horizontal">
                                    <div class="form-group">
                                        <label for="exampleInputAccount4" class="col-sm-offset-1 col-sm-2">考核一组</label>
                                        <div class="col-md-6 col-sm-8">
                                            <select type="text" class="form-control" >
                                                <option>选择班次</option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="exampleInputAccount4" class="col-sm-offset-1 col-sm-2">考核二组</label>
                                        <div class="col-md-6 col-sm-8">
                                            <select type="text" class="form-control" >
                                                <option>选择班次</option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="exampleInputAccount4" class="col-sm-offset-1 col-sm-2">考核三组</label>
                                        <div class="col-md-6 col-sm-8">
                                            <select type="text" class="form-control" >
                                                <option>选择班次</option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="exampleInputAccount4" class="col-sm-offset-1 col-sm-2">考核四组</label>
                                        <div class="col-md-6 col-sm-8">
                                            <select type="text" class="form-control" >
                                                <option>选择班次</option>
                                            </select>
                                        </div>
                                    </div>
                                    
                                    <hr>
                                    
                                    <div class="form-group">
                                        <div class="col-sm-12">
                                            <button type="submit" style="float:right;margin-right:3px;" class="btn btn-info">生成本月排班</button>
                                            <button type="submit" style="float:right;margin-right:10px;" class="btn btn-info">生成今日排班</button>
                                            <button type="submit" style="float:right;margin-right:10px;" class="btn btn">关闭</button>
                                        </div>
                                    </div>
                                    </form>
                            </div>
                            <!--添加对话框结束-->
                    </div>
                    </div>
                </div>
            </div>
            <!--对话框 结束-->
        </div>
        <!-- e-->
    <link rel="import" href="/view/common/foot.html?__inline">
    <script src="/node_modules/zui/dist/lib/calendar/zui.calendar.js"></script>
</body>
<style type="text/css" >
    span.time{
        display: none !important ;
    }
    div.day{
        text-align: center ;
    }
</style>
<script type="text/javascript">
    
   $(document).ready(function() {
          $('#calendar').calendar();

         var calendar = $('#calendar').data('zui.calendar');
        var newEvents =
        [
            {title: '考核二班-晚班',  start: '2017-5-1 ', end: '2017-5-1 '},
            {title: '考核三班-晚班',  start: '2017-5-1 ', end: '2017-5-1 '},
            {title: '考核四班-晚班',  start: '2017-5-1 ', end: '2017-5-1 '},
            {title: '考核一班-休息',  start: '2017-5-1 ', end: '2017-5-1 '},
            {title: '考核二班-晚班',  start: '2017-5-12 ', end: '2017-5-12 '},
            {title: '考核三班-晚班',  start: '2017-5-12 ', end: '2017-5-12 '},
            {title: '考核四班-晚班',  start: '2017-5-12 ', end: '2017-5-12 '},
            {title: '考核一班-休息',  start: '2017-5-12 ', end: '2017-5-12 '},
            {title: '未排班',  start: '2017-5-11 ', end: '2017-5-11 '},
            {title: '未排班',  start: '2017-5-11 ', end: '2017-5-11'},
            {title: '未排班',  start: '2017-5-11 ', end: '2017-5-11 '},
            {title: '未排班',  start: '2017-5-11 ', end: '2017-5-11 '},
            {title: '未排班',  start: '2017-5-13 ', end: '2017-5-13 '},
            {title: '未排班',  start: '2017-5-13 ', end: '2017-5-13'},
            {title: '未排班',  start: '2017-5-13 ', end: '2017-5-13 '},
            {title: '未排班',  start: '2017-5-13 ', end: '2017-5-13 '},
        ];
        calendar.addEvents(newEvents);

        $('#calendar').calendar().on("clickEvent.zui.calendar", function(event) {
            console.log(event.event);
            // alert(event.event.title);
            // console.log("你点击了一个事件");
            // 处理 clickEvent 事件
            // ...
            // 对话框弹出
            $('#myModal').modal();
        });

   })

</script>

</html>